body, #content-container {
  background-color: #F0F3F5;
  color: #5f5f5f;
}

#container.boxed-layout {
  background-color: #e4e9ed;
}

.page-header {
  color: #8a8a8a;
}

a {
  color: #5f5f5f;
}

a:hover,
a:focus {
  color: #525252;
}

/* SEARCHBOX */
/*======================================*/
.searchbox .custom-search-form .input-group-btn:before {
  background-color: #40c4a7;
}

/* Scrollbar */
/*======================================*/
.pace .pace-progress,
.nano > .nano-pane > .nano-slider {
  background-color: #2b8c77;
}

.pace .pace-progress-inner {
  box-shadow: 0 0 10px #40c4a7, 0 0 5px #40c4a7;
}

.pace .pace-activity {
  background-color: #40c4a7;
}

/* NAVBAR */
/*=====================================*/
#navbar {
  background-color: #F0F3F5;
}

#navbar-container {
  box-shadow: 0 2px 0px -1px rgba(0, 0, 0, 0.05);
}

.navbar-header {
  background-color: #3a3f44;
}

.navbar-content {
  background-color: #40c4a7;
  box-shadow: inset -4px 0 0 0 #40c4a7;
}

/* BRAND LOGO & TEXT */
/*====================================*/
.navbar-brand {
  background-color: transparent;
  color: #fff;
}

.navbar-brand:hover, .navbar-brand:focus {
  color: #fff;
}

/* NAVIGATION */
/*======================================*/
/* NAVBAR ICON & BUTTON */
/*======================================*/
.navbar-icon-color, .navbar-top-links > li > a:focus:not(.mainnav-toggle) > i, .navbar-top-links > li > a:hover:not(.mainnav-toggle) > i {
  color: #d9d9d9;
}

.navbar-top-links > li > a {
  color: #fff;
}

.navbar-top-links > li > a:not(.mainnav-toggle) > i {
  color: white;
}

.navbar-top-links > li > a:focus {
  background-color: transparent;
}

.navbar-top-links > li > a:hover {
  background-color: #37b398;
  color: #d9d9d9;
}

.navbar-top-links > .open > a, .navbar-top-links > .open > a:focus {
  background-color: #37b398;
  color: #fff;
}

.navbar-top-links .tgl-menu-btn > a, .navbar-top-links .tgl-menu-btn > a:hover, .navbar-top-links .tgl-menu-btn > a:focus {
  color: #fff;
}

/* NAVBAR RESPONSIVE */
/*======================================*/
@media (min-width: 768px) {
  #navbar {
    background-color: transparent;
  }
  .navbar-header {
    background-color: transparent;
  }
  .navbar-header:before {
    background-color: #3a3f44;
  }
  #navbar-container {
    background-color: #40c4a7;
  }
  #container.mainnav-in .brand-title,
  #container.mainnav-sm .brand-title,
  #container.mainnav-lg .brand-title {
    color: #fff;
  }
  .navbar-top-links .tgl-menu-btn {
    position: static;
  }
  .navbar-top-links .tgl-menu-btn > a, .navbar-top-links .tgl-menu-btn > a:hover {
    color: #fff;
  }
  .navbar-top-links .tgl-menu-btn > a:focus {
    background-color: transparent;
    color: #fff;
  }
}

/* NAVIGATION */
/*======================================*/
#mainnav {
  background-color: #3a3f44;
}

#mainnav .list-header {
  color: #9098a0;
}

/* NAVIGATION MENU */
/*======================================*/
#mainnav-menu a {
  color: #b9bfc4;
}

#mainnav-menu > li > a:hover, #mainnav-menu > li > a:active {
  color: #fff;
}

#mainnav-menu > li > a.hover {
  color: #fff;
  background-color: #41474c;
  box-shadow: inset 4px 0 0 0 #40c4a7;
}

#mainnav-menu > .active-link > a, #mainnav-menu > .active-link > a:hover {
  color: #fff;
  box-shadow: inset 4px 0 0 0 #40c4a7;
}

#mainnav-menu > .active-sub > a, #mainnav-menu > .active-sub > a:hover {
  color: #fff;
}

#mainnav-menu > .active {
  background-color: #33373c;
}

#mainnav-menu > .active .active {
  background-color: #2e3236;
}

#mainnav-menu ul a:hover, .menu-popover .sub-menu ul a:hover {
  color: #fff;
}

#mainnav-menu ul ul a:hover, .menu-popover .sub-menu ul ul a:hover {
  color: #fff;
}

#mainnav-menu ul .active-link a, .menu-popover .sub-menu ul .active-link a {
  color: #fff;
  box-shadow: inset 4px 0 0 0 #40c4a7;
}

#container.mainnav-sm #mainnav-menu a:hover {
  box-shadow: inset 4px 0 0 0 #40c4a7;
}

#container.mainnav-sm #mainnav-menu > .active-link > a, #container.mainnav-sm #mainnav-menu > .active-link a:hover, #container.mainnav-sm #mainnav-menu > .active-sub > a, #container.mainnav-sm #mainnav-menu > .active-sub a:hover {
  background-color: #40c4a7;
}

/* NAVIGATION - SHORTCUT BUTTONS */
/*======================================*/
#mainnav-shortcut .shortcut-grid {
  color: #fff;
}

/* NAVIGATION - WIDGET */
/*======================================*/
.mainnav-widget {
  background-color: rgba(0, 0, 0, 0.05);
  color: #b9bfc4;
}

@media (min-width: 768px) {
  #container.mainnav-sm .shortcut-grid:hover {
    box-shadow: inset 4px 0 0 0 #40c4a7;
  }
  #container.mainnav-sm .shortcut-grid:hover,
  #container.mainnav-sm .popover.mainnav-shortcut {
    background-color: #41474c;
    color: #fff;
  }
  #container.mainnav-sm #mainnav-menu .active-link > a, #container.mainnav-sm #mainnav-menu .active-sub > a {
    color: #fff;
  }
  #container.mainnav-sm #mainnav .mainnav-widget > .show-small a {
    color: #b9bfc4;
  }
  #container.mainnav-sm #mainnav .mainnav-widget > .show-small a:hover {
    color: #fff;
    box-shadow: inset 4px 0 0 0 #40c4a7;
  }
  #container.mainnav-sm #mainnav .mainnav-widget .hover {
    color: #fff;
    background-color: #41474c;
  }
  /* NAVIGATION - POPOVER  */
  /*======================================*/
  .menu-popover .sub-menu ul {
    background-color: #33373c;
  }
  .menu-popover .sub-menu ul ul {
    background-color: #2e3236;
  }
  .menu-popover .sub-menu ul li > a {
    color: #fff;
  }
  .menu-popover .single-content {
    color: #fff;
    background-color: #41474c;
  }
  .menu-popover.popover {
    background-color: #353a3e;
    color: #fff;
  }
  .menu-popover > .popover-title {
    background-color: #41474c;
    color: #fff;
  }
  .menu-popover .mainnav-widget-content {
    background-color: #41474c;
  }
}

.mainnav-sm .popover.mainnav-shortcut {
  background-color: #353a3e;
  color: #fff;
}

/* NAVIGATION - OFFCANVAS */
/*======================================*/
@media (min-width: 768px) {
  .nav-oc-shadow, #container.mainnav-in.easeInBack #mainnav-container, #container.mainnav-in.easeOutBack #mainnav-container, #container.mainnav-in.easeInOutBack #mainnav-container, #container.mainnav-in.jumping #mainnav-container, #container.mainnav-out.easeInBack #mainnav-container, #container.mainnav-out.easeOutBack #mainnav-container, #container.mainnav-out.easeInOutBack #mainnav-container, #container.mainnav-out.jumping #mainnav-container {
    box-shadow: -20px 0 0 0 #3a3f44;
  }
  #container.mainnav-out .brand-title {
    background-color: transparent;
    color: #fff;
  }
}

/* ASIDE */
/* ===================================== */
#container #aside-container {
  background-color: #fff;
}

#container #aside .list-link li a:not(.btn) {
  color: #d1d1d1;
}

#container #aside .list-link li a:not(.btn):hover {
  color: #fff;
}

#aside {
  background-color: #484e55;
  color: #fff;
}

#aside a:not(.btn):not(.btn-link) {
  color: inherit;
}

#aside .bord-all,
#aside .bord-top,
#aside .bord-btm,
#aside .bord-left,
#aside .bord-rgt,
#aside .bord-hor,
#aside .bord-ver,
#aside .list-divider {
  border-color: #4f565d;
}

#aside .btn-link {
  color: #fff;
}

#aside .text-muted {
  color: #a1a8ae;
}

/* Aside with tabs */
/* ===================================== */
#aside-container #aside .nav-tabs li:not(active) a {
  background-color: #41474c;
}

#container.aside-bright #aside .nav-tabs li:not(.active) a {
  background-color: #f2f2f2;
}

@media (min-width: 768px) {
  #aside {
    background-color: #484e55;
  }
  #container #aside-container {
    background-color: #fff;
  }
}

/* ASIDE : BRIGHT COLOR THEMES */
/* ===================================== */
#container.aside-bright #aside {
  background-color: #fff;
  border-color: #f2f2f2;
  color: #515151;
  border: 1px solid #d9e1e6;
}

#container.aside-bright #aside .text-light {
  color: #5f5f5f;
}

#container.aside-bright #aside .bord-all,
#container.aside-bright #aside .bord-top,
#container.aside-bright #aside .bord-btm,
#container.aside-bright #aside .bord-lft,
#container.aside-bright #aside .bord-rgt,
#container.aside-bright #aside .bord-hor,
#container.aside-bright #aside .bord-ver,
#container.aside-bright #aside .list-divider {
  border-color: #f7f7f7;
}

#container.aside-bright #aside .text-muted {
  color: #ababab;
}

#container.aside-bright #aside .progress {
  background-color: #e6e6e6;
}

#container.aside-bright #aside .list-link li a:not(.btn) {
  color: #5e5e5e;
}

#container.aside-bright #aside .list-link li a:not(.btn):hover {
  color: #515151;
}

#container.aside-bright #aside a:not(.btn) {
  color: #515151;
}

#container.aside-bright #aside a:not(.btn):hover, #container.aside-bright #aside a:not(.btn):focus {
  color: #373737;
}

#container.aside-bright #aside .btn-link {
  color: #515151;
}

/* FOOTER */
/*======================================*/
#container.footer-fixed #footer {
  background-color: #d1d1d1;
  color: #5f5f5f;
}

/* BORDER */
/*======================================*/
.bord-no {
  border: 0 !important;
}

.bord-all {
  border: 1px solid #e9e9e9;
}

.bord-top {
  border-top: 1px solid #e9e9e9;
}

.bord-btm {
  border-bottom: 1px solid #e9e9e9;
}

.bord-lft {
  border-left: 1px solid #e9e9e9;
}

.bord-rgt {
  border-right: 1px solid #e9e9e9;
}

.bord-ver {
  border-top: 1px solid #e9e9e9;
  border-bottom: 1px solid #e9e9e9;
}

.bord-hor {
  border-right: 1px solid #e9e9e9;
  border-left: 1px solid #e9e9e9;
}

/* TIMELINE */
/*======================================*/
.timeline {
  background-color: #ebeef0;
  color: #5f5f5f;
}

.timeline:before, .timeline:after {
  background-color: #cad3df;
}

.timeline-time {
  background-color: #ebeef0;
  color: #929292;
}

.timeline-icon {
  box-shadow: 0 0 0 7px #F0F3F5;
}

.timeline-icon:empty {
  background-color: #a4b4c7;
}

.timeline-label {
  background-color: #ffffff;
  border: 1px solid #e9e9e9;
}

.timeline-label:before {
  border-right: 10px solid #e6e6e6;
}

.timeline-label:after {
  border-right: 9px solid #ffffff;
}

.panel .timeline-label {
  background-color: #f7f7f7;
  border: 1px solid #e3e3e3;
}

.panel .timeline-label:before {
  border-right-color: #e3e3e3;
}

.panel .timeline-label:after {
  border-right-color: #f7f7f7;
}

@media (min-width: 768px) {
  .two-column.timeline .timeline-entry:nth-child(even) .timeline-label:before {
    border-left: 10px solid #e6e6e6;
  }
  .two-column.timeline .timeline-entry:nth-child(even) .timeline-label:after {
    border-left: 9px solid #ffffff;
  }
}

/* FORM WIZARD */
/*======================================*/
.wz-icon-bw li.active ~ li > a .icon-wrap {
  color: #5f5f5f;
  background-color: rgba(0, 0, 0, 0.17);
}

.wz-icon-bw li:not(.active) > a p {
  color: #5f5f5f !important;
}

/* FORM CONTROL  */
/*======================================*/
.form-control:focus {
  border-color: #40c4a7;
}

/* LIST GROUP */
/*======================================*/
.list-group-item.active, .list-group-item.active:hover, .list-group-item.active:focus {
  background-color: #40c4a7;
  border-color: #40c4a7;
  color: #fff;
}

.list-group-item.active .list-group-item-text, .list-group-item.active:hover .list-group-item-text, .list-group-item.active:focus .list-group-item-text {
  color: #fff;
}

/* DROPDOWN */
/*======================================*/
.dropdown-menu > li > a:hover {
  background-color: #40c4a7;
  color: #fff;
}

/*======================================*/
/* PAGER */
/*======================================*/
.pager li > a:hover, .pager li > a:focus {
  background-color: #ffffff;
  border-color: #40c4a7;
  color: #40c4a7;
  box-shadow: inset 0 0 1px #40c4a7;
  z-index: 2;
  -webkit-transition: border-color, 0.3s;
  transition: border-color, 0.3s;
}

/*======================================*/
/* PAGINATION */
/*======================================*/
.pagination > li a:hover,
.pagination > li a:focus {
  border-color: #40c4a7;
  color: #40c4a7;
  box-shadow: inset 0 0 1px #40c4a7;
}

.pagination > .active > a, .pagination > .active > span, .pagination > .active > a:hover, .pagination > .active > span:hover, .pagination > .active > a:focus, .pagination > .active > span:focus {
  background-color: #40c4a7;
  border-color: #40c4a7;
}

/* TAB */
/*======================================*/
.tab-base .tab-content .tab-footer {
  background-color: #f9fafb;
  color: #5f5f5f;
  border-color: #f3f5f7;
}

.tab-base .nav-tabs > li:not(.active) > a:hover {
  border-color: #40c4a7;
}

.tab-stacked-left.tab-base .nav-tabs > li:not(.active) a:hover {
  border-color: #40c4a7;
  border-right-color: transparent;
}

.tab-stacked-right.tab-base .nav-tabs > li:not(.active) a:hover {
  border-color: #40c4a7;
  border-left-color: transparent;
}

/* BUTTONS */
/*======================================*/
.btn-trans {
  color: #929292;
}

/* PANELS */
/*======================================*/
.panel:not(.panel-colorful) {
  border: 1px solid #ebeff2;
}

.panel-footer {
  background-color: #f9fafb;
  color: #5f5f5f;
  border-color: #f3f5f7;
  position: relative;
}
